<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>咨询指南</title>
    <meta name="viewport" content="width=device-width, user-scalable=0, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="/natal/js/rem.js"></script>
    <meta name="description" content="">
    <style>
        body {
            background-color: #10101C;
        }

        * {
            padding: 0;
            margin: 0;
        }

        #app {
            width: 100%;
            max-width: 750px;
            margin: 0 auto;
        }

        .img {
            width: 100%;
            display: block;
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

        .nav {
            position: fixed;
            top: 0;
            left: 0;
            min-height: 0.88rem;
            z-index: 100;
            max-width: 100%;
            width: 100%;
        }

        .nav .bg-color {
            background-color: #10101C;
            opacity: 0;
        }

        .nav-box {
            max-width: 100%;
            width: 7.5rem;
            margin: 0 auto;
            position: relative;
        }

        .nav .img {
            width: 0.44rem;
            height: 0.44rem;
            position: absolute;
            /*left: 0.10rem;*/
            bottom: 0;
            z-index: 110;
            padding: 0.22rem 0.20rem;
            background: url("https://oss-good.haozhunapp.com/zyhsapp/back_icon.png") no-repeat center center;
            background-size: 0.44rem 0.44rem;
        }

        .nav .title-name {
            height: 0.38rem;
            line-height: 0.38rem;
            font-size: 0.36rem;
            text-align: center;
            position: absolute;
            bottom: 0.25rem;
            max-width: 100%;
            width: 7.5rem;
            z-index: 101;
            color: #CCD0F3;
        }
    </style>
</head>
<body>
<div id="app" style="padding-top: 20px">
    <div class="nav" style="visibility:{$is_show_nav?'visible':'hidden'}">
        <div class="nav-box">
            <div class="bg-color" style="height: {$height/50 + 0.88}rem"></div>
            <div class="to-back" onclick="commonJsToNative('local', 'back');">
                <div class="img"></div>
            </div>
            <div class="title-name">咨询指南</div>
        </div>
    </div>
    <img src="https://oss-good.haozhunapp.com/zyhsapp/guide/guide1_v2.png" class="img" alt="">
    <img src="https://oss-good.haozhunapp.com/zyhsapp/guide/guide2_v2.png" class="img" alt="">
</div>
</body>
<script type="text/javascript" src="/natal/js/jquery-v2.1.1.min.js"></script>
<script type="text/javascript">
    window.appType = '{$appType}';

    function init() {
        var winPos = $(window).scrollTop();
        var opacity = 0;
        if (winPos >= 250) {
            opacity = 1;
        } else if (winPos <= 0) {
            opacity = 0
        } else {
            opacity = winPos / 250;
        }
        $('.bg-color').css('opacity', opacity);
    }

    $(window).scroll(init);
    init();
</script>
<script type="text/javascript" src="/static/common.js"></script>
</html>
